<template>
    <div>
        <EditCustomerContactsDialog
            :visible="editCustomerContactsVisible"
            :on-close="closeEditCustomerContacts"
            :callback="editCustomerContacts"
            :options="options"
            :customer="editCustomerForm"
            ref="CustomerContactsDialog"
        />
        <EditCustomerRelationshipDialog
            ref="CustomerRelationshipDialog"
            :customer="editCustomerForm"
            :visible="editCustomerRelationshipVisible"
            :on-close="closeEditCustomerRelationship"
            :callback="editCustomerRelationship"
            :options="options"
        />
        <AddCustomerContactsDialog
            ref="AddCustomerContactsDialog"
            :customer="editCustomerForm"
            :visible="addCustomerContactsVisible"
            :on-close="closeAddCustomerContacts"
            :callback="addCustomerContacts"
            :options="options"
        />
        <AddCustomerRelationshipDialog
            ref="AddCustomerRelationshipDialog"
            :customer="editCustomerForm"
            :visible="addCustomerRelationshipVisible"
            :on-close="closeAddCustomerRelationship"
            :callback="addCustomerRelationship"
            :options="options"
        />


        <el-dialog
            :fullscreen="fullscreen"
            :before-close="handleClose"
            @close="closeEditCustomer"
            :visible.sync="visible"
            width="80%">
            <div slot="title">
                <div
                    style=" width:600px;display: flex;align-items: center;justify-content: space-between;border-bottom: #99a9bf 1px solid;padding-bottom: 10px">
                    <span style="font-weight: bold">Edit Customer</span>
                    <div>
                        <el-button :disabled="disable1" class="button2" size="small" type="primary"
                                   icon="el-icon-circle-plus-outline"
                                   @click="handleEditCustomer">Save
                        </el-button>
                        <el-button class="button2" size="small"
                                   :type="editCustomerForm.customerStatus === '20' ? 'success' : 'warning'"
                                   @click="handleFreezeCustomer">
                            {{ editCustomerForm.customerStatus === '20' ? 'UnFreeze' : 'Freeze' }}
                        </el-button>
                        <el-button class="button3" size="small" @click="resetEditCustomer">Cancel</el-button>
                    </div>
                </div>


            </div>
            <div class="fullscreen" @click="onFullScreenClick">
                <i class="el-icon-full-screen"/>
            </div>
            <div style="padding-left: 10px;padding-right: 20px">
                <el-row :gutter="20" style="margin-top: -15px">
                    <el-col :span="10">
                        <div>
                            <span style="font-size: 18px;font-weight: bold">Customer Information</span>
                            <el-tag :type="editCustomerForm.customerStatus==='20'?'danger':'success'"
                                    style="margin-left: 10px">
                                {{ editCustomerForm.customerStatus === '20' ? 'Freeze' : 'Normal' }}
                            </el-tag>
                        </div>
                        <el-form
                            :disabled="disable1"
                            ref="editCustomerForm"
                            :model="editCustomerForm"
                            :rules="addCustomerRules"
                            size="medium"
                            label-width="100px"
                            label-position="left"
                            style="margin-top: 15px">
                            <el-form-item label-width="100px" label="Id" prop="customerId">
                                <el-input v-model="editCustomerForm.customerId" :disabled='true'
                                          :style="{width: '100%'}"></el-input>
                            </el-form-item>
                            <el-row type="flex" justify="start" align="top">
                                <el-form-item label-width="100px" label="Name" prop="customerName">
                                    <el-input v-model="editCustomerForm.customerName"
                                              placeholder="Please input customerName" clearable
                                    ></el-input>
                                </el-form-item>
                                <el-form-item label-width="100px" label="Country" prop="customerCountry">
                                    <el-select v-model="editCustomerForm.customerCountry"
                                               placeholder="Please choose Country" filterable
                                               clearable
                                    >
                                        <el-option v-for="(item, index) in options.customerCountryOptions" :key="index"
                                                   :label="item.label"
                                                   :value="item.value" :disabled="item.disabled"></el-option>
                                    </el-select>
                                </el-form-item>
                            </el-row>
                            <el-row type="flex" justify="start" align="top">
                                <el-form-item label-width="100px" label="City" prop="customerCity">
                                    <el-cascader v-model="editCustomerForm.customerCity"
                                                 :options="options.customerCityOptions"
                                                 :props="customerCityProps" placeholder="Please choose City"
                                                 filterable
                                                 clearable>
                                    </el-cascader>
                                </el-form-item>
                                <el-form-item label-width="100px" label="Address" prop="customerAddress">
                                    <el-input v-model="editCustomerForm.customerAddress"
                                              placeholder="Please input Address" clearable
                                    ></el-input>
                                </el-form-item>
                            </el-row>
                            <el-row type="flex" justify="start" align="top">
                                <el-form-item label-width="100px" label="postCode" prop="postCode">
                                    <el-input v-model="editCustomerForm.postCode" placeholder="Please input postCode"
                                              clearable
                                    >
                                    </el-input>
                                </el-form-item>
                                <el-form-item label-width="120px" label="enterpriseUrl" prop="enterpriseUrl">
                                    <el-input v-model="editCustomerForm.enterpriseUrl"
                                              placeholder="Please input enterpriseUrl" clearable
                                    ></el-input>
                                </el-form-item>
                            </el-row>
                            <el-row type="flex" justify="start" align="top">
                                <el-form-item label-width="110px" label="taxId" prop="taxId">
                                    <el-input v-model="editCustomerForm.taxId" placeholder="Please input taxId"
                                              clearable
                                    >
                                    </el-input>
                                </el-form-item>
                                <el-form-item label-width="100px" label="taxType" prop="taxType">
                                    <el-select v-model="editCustomerForm.taxType" placeholder="Please choose taxType"
                                               clearable
                                    >
                                        <el-option v-for="(item, index) in options.taxTypeOptions" :key="index"
                                                   :label="item.label"
                                                   :value="item.value" :disabled="item.disabled"></el-option>
                                    </el-select>
                                </el-form-item>
                            </el-row>
                            <el-row type="flex" justify="start" align="top">
                                <el-form-item label-width="125px" label="accountGroup" prop="accountGroup">
                                    <el-select v-model="editCustomerForm.accountGroup"
                                               placeholder="Please choose accountGroup" filterable
                                               clearable
                                    >
                                        <el-option v-for="(item, index) in options.accountGroupOptions" :key="index"
                                                   :label="item.label"
                                                   :value="item.value" :disabled="item.disabled"></el-option>
                                    </el-select>
                                </el-form-item>
                                <el-form-item label-width="100px" label="enterpriseProperty" prop="enterpriseProperty">
                                    <el-select v-model="editCustomerForm.enterpriseProperty"
                                               placeholder="Please choose enterpriseProperty"
                                               filterable
                                               clearable
                                    >
                                        <el-option v-for="(item, index) in options.enterprisePropertyOptions"
                                                   :key="index"
                                                   :label="item.label"
                                                   :value="item.value" :disabled="item.disabled"></el-option>
                                    </el-select>
                                </el-form-item>
                            </el-row>
                            <el-row type="flex" justify="start" align="top">
                                <el-form-item label-width="100px" label="annualSalesRevenue" prop="annualSalesRevenue">
                                    <el-input v-model="editCustomerForm.annualSalesRevenue"
                                              placeholder="Please input annualSalesRevenue"
                                              clearable
                                    ></el-input>
                                </el-form-item>
                                <el-form-item label-width="115px" label="productType" prop="productType">
                                    <el-input v-model="editCustomerForm.productType"
                                              placeholder="Please input productType" clearable
                                    ></el-input>
                                </el-form-item>
                            </el-row>
                            <el-form-item label-width="125px" label="softwareBrand" prop="softwareBrand">
                                <el-input v-model="editCustomerForm.softwareBrand"
                                          placeholder="Please input softwareBrand" clearable
                                ></el-input>
                            </el-form-item>
                            <el-form-item label="note" prop="note">
                                <el-input v-model="editCustomerForm.note" type="textarea"
                                          placeholder="Please input note"
                                          :autosize="{minRows: 3, maxRows: 5}"></el-input>
                            </el-form-item>
                        </el-form>
                    </el-col>
                    <el-col :span="14">
                        <div>
                            <div slot="header">
                                <span style="font-size: 18px;font-weight: bold">Customer Contacts</span>
                                <el-button :disabled="disable1" class="button2" type="primary"
                                           icon="el-icon-circle-plus-outline"
                                           size="small"
                                           style="float: right; margin-bottom: 10px" @click="openAddCustomerContacts">
                                    Add
                                </el-button>
                            </div>
                            <el-table

                                :size="fullscreen?'':'small'"
                                :data="customerContactsTable"
                                ref="customerContactsTable">
                                <el-table-column
                                    prop="contactsId"
                                    label="Id"
                                    width="60">
                                </el-table-column>
                                <el-table-column
                                    prop="contactsName"
                                    label="Name"
                                    width="60">
                                </el-table-column>
                                <el-table-column
                                    prop="contactsDept"
                                    label="Dept"
                                    width="80">
                                </el-table-column>
                                <el-table-column
                                    prop="contactsPosition"
                                    label="Position"
                                    width="60">
                                </el-table-column>
                                <el-table-column
                                    prop="contactsTelephone"
                                    label="Telephone"
                                    show-overflow-tooltip
                                >
                                </el-table-column>
                                <el-table-column
                                    prop="contactsMobilephone"
                                    label="Mobilephone"
                                    show-overflow-tooltip
                                >
                                </el-table-column>
                                <el-table-column
                                    prop="contactsFax"
                                    label="Fax"
                                    show-overflow-tooltip
                                >
                                </el-table-column>
                                <el-table-column
                                    prop="contactsEmail"
                                    label="Email"
                                    show-overflow-tooltip
                                >
                                </el-table-column>
                                <el-table-column
                                    prop="contactsQq"
                                    label="QQ"
                                    show-overflow-tooltip
                                >
                                </el-table-column>
                                <el-table-column
                                    prop="contactsWechat"
                                    label="Wechat"
                                    show-overflow-tooltip
                                >
                                </el-table-column>
                                <el-table-column
                                    label="Operation"
                                    width="160"
                                >
                                    <template slot-scope="scope">
                                        <el-button
                                            size="small"
                                            icon="el-icon-edit"
                                            type="success"
                                            circle
                                            :disabled="disable1"
                                            @click="handleEditCustomerContacts(scope.$index, scope.row)">
                                        </el-button>
                                        <el-button
                                            size="mini"
                                            icon="el-icon-delete"
                                            type="danger"
                                            circle
                                            :disabled="disable1"
                                            @click="handleDeleteCustomerContacts(scope.$index, scope.row)">
                                        </el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>

                        <div style="margin-top: 80px">
                            <div slot="header">
                                <span style="font-size: 18px;font-weight: bold">Customer Relationship</span>
                                <el-button class="button2" type="primary" icon="el-icon-circle-plus-outline"
                                           size="small"
                                           :disabled="disable1"
                                           style="float: right; margin-bottom: 10px"
                                           @click="openAddCustomerRelationship">Add
                                </el-button>
                            </div>
                            <el-table :data="customerRelationshipTable"
                                      ref="customerRelationshipTable">
                                <el-table-column
                                    prop="relativeCustomerId2"
                                    label="relativeCustomerId"
                                    width="120">
                                </el-table-column>
                                <el-table-column
                                    prop="relativeCustomerName"
                                    label="relativeCustomerName"
                                >
                                </el-table-column>
                                <el-table-column
                                    prop="customerRelationName"
                                    label="customerRelationName"
                                >
                                </el-table-column>
                                <el-table-column
                                    label="Operation"
                                    width="160">
                                    <template slot-scope="scope">
                                        <el-button
                                            size="small"
                                            icon="el-icon-edit"
                                            type="success"
                                            circle
                                            :disabled="disable1"
                                            @click="handleEditCustomerRelationship(scope.$index, scope.row)">
                                        </el-button>
                                        <el-button
                                            size="small"
                                            icon="el-icon-delete"
                                            type="danger"
                                            circle
                                            :disabled="disable1"
                                            @click="handleDeleteCustomerRelationship(scope.$index, scope.row)">
                                        </el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                        </div>
                    </el-col>
                </el-row>
            </div>


        </el-dialog>
    </div>
</template>

<script>
import EditCustomerContactsDialog from "@/views/NPMS/Customer/CustomerManage/Dialog/EditCustomerContactsDialog";
import EditCustomerRelationshipDialog from "@/views/NPMS/Customer/CustomerManage/Dialog/EditCustomerRelationshipDialog";
import QS from "qs";
import AddCustomerContactsDialog from "@/views/NPMS/Customer/CustomerManage/Dialog/AddCustomerContactsDialog";
import AddCustomerRelationshipDialog from "@/views/NPMS/Customer/CustomerManage/Dialog/addCustomerRelationshipDialog";

export default {
    name: "EditCustomerDialog",
    components: {
        EditCustomerRelationshipDialog,
        EditCustomerContactsDialog,
        AddCustomerContactsDialog,
        AddCustomerRelationshipDialog
    },
    props: ['visible', 'onClose', 'callback', 'options'],
    data() {
        return {
            //fullscreen
            fullscreen: false,

            editCustomerContactsVisible: false,
            editCustomerRelationshipVisible: false,
            addCustomerContactsVisible: false,
            addCustomerRelationshipVisible: false,
            disable1: false,
            customerContactsTable: [{
                contactsId: "1",
                contactsName: "lxp",
                contactsDept: "销售一部",
                contactsPosition: "部长",
                contactsTelephone: "123456",
                contactsMobilephone: "123456",
                contactsFax: "123456",
                contactsEmail: "123@163.com",
                contactsQq: "123456",
                contactsWechat: "123456"
            }],
            editCustomerForm: {
                customerId: "10",
                customerName: "岳阳林纸股份有限公司",
                customerCountry: undefined,
                customerCity: undefined,
                customerAddress: undefined,
                postCode: undefined,
                enterpriseUrl: undefined,
                taxId: undefined,
                taxType: undefined,
                accountGroup: undefined,
                enterpriseProperty: undefined,
                annualSalesRevenue: undefined,
                productType: undefined,
                softwareBrand: undefined,
                note: undefined,
            },
            addCustomerRules: {
                customerName: [{
                    required: true,
                    message: 'Please input customerName',
                    trigger: 'blur'
                }],
                customerCountry: [{
                    required: true,
                    message: 'Please choose customerCountry',
                    trigger: 'change'
                }],
                customerCity: [{
                    required: true,
                    message: 'Please choose customerCity',
                    trigger: 'change'
                }],
                customerAddress: [{
                    required: true,
                    message: 'Please input customerAddress',
                    trigger: 'blur'
                }],
                postCode: [{
                    required: true,
                    message: 'Please input postCode',
                    trigger: 'blur'
                }],
                enterpriseUrl: [{
                    required: true,
                    message: 'Please input enterpriseUrl',
                    trigger: 'blur'
                }],
                taxId: [{
                    required: true,
                    message: 'Please input taxId',
                    trigger: 'blur'
                }],
                taxType: [{
                    required: true,
                    message: 'Please choose taxType',
                    trigger: 'change'
                }],
                accountGroup: [{
                    required: true,
                    message: 'Please choose accountGroup',
                    trigger: 'change'
                }],
                enterpriseProperty: [{
                    required: true,
                    message: 'Please choose enterpriseProperty',
                    trigger: 'change'
                }],
                annualSalesRevenue: [{
                    required: true,
                    message: 'Please input annualSalesRevenue',
                    trigger: 'blur'
                }],
                productType: [{
                    required: true,
                    message: 'Please input productType',
                    trigger: 'blur'
                }],
                softwareBrand: [{
                    required: true,
                    message: 'Please input softwareBrand',
                    trigger: 'blur'
                }],
                note: [{
                    required: true,
                    message: 'Please input note',
                    trigger: 'blur'
                }],

            },
            customerRelationshipTable: [{
                relativeCustomerId2: "1",
                relativeCustomerName: "zbt",
                customerRelationName: "母公司"
            }],
            customerCityProps: {
                "multiple": false,
                "label": "label",
                "value": "value",
                "children": "children"
            },

        }
    },
    methods: {
        //后端交互 取得当前客户的联系人与关联客户列表
        loadCustomerContacts(customer) {
            this.$axios.post(
                '/customer/customer/queryAllCustomerContacts',
                customer
            ).then(res => {
                console.log(res)
                this.customerContactsTable = res.data.obj
            });
        },
        loadCustomerRelationship(customer) {
            this.$axios.post(
                '/customer/customer/queryAllCustomerRelationship',
                customer
            ).then(res => {
                console.log(res)
                this.customerRelationshipTable = res.data.obj
            });
        },

        //fullScreen
        onFullScreenClick() {
            this.fullscreen = !this.fullscreen
        },

        //customer
        closeEditCustomer() {
            this.onClose()
        },
        resetEditCustomer() {
            if (this.currentUser.roles[0] !== this.$npms.roles.MARKET_SP) {
                this.$confirm('Closing now will lose all unsaved data. Confirm closing?', {
                    cancelButtonText: 'cancel',
                    confirmButtonText: 'confirm'
                })
                    .then(e => {
                        this.$refs['editCustomerForm'].resetFields();
                        this.closeEditCustomer()
                    });
            } else {
                this.$refs['editCustomerForm'].resetFields();
                this.closeEditCustomer()
            }
        },
        handleEditCustomer() {
            this.$refs['editCustomerForm'].validate(valid => {
                if (!valid) return

                var cusData = JSON.parse(JSON.stringify(this.editCustomerForm));

                cusData.customerStatus = 10;
                cusData.customerCity = JSON.stringify(cusData.customerCity);
                var data = JSON.parse(JSON.stringify({
                    customer: cusData,
                }))
                console.log('parse:', data)
                this.callback(data)
                this.closeEditCustomer();
            })
        },

        //customerContacts
        updateCustomerContacts(customerContacts) {
            var _this = this
            this.$axios.post(
                '/customer/customer/updateContacts',
                customerContacts
            ).then(res => {
                var customer = this.editCustomerForm;

                customer.customerCity = JSON.stringify(this.editCustomerForm.customerCity)
                customer.customerStatus = 10
                customer.customerMgrName = 1
                customer.customerMgrDept = 1
                _this.loadCustomerContacts(customer)
                console.log(res)
            });
        },
        //打开弹窗
        openAddCustomerContacts() {
            this.addCustomerContactsVisible = true
        },
        //关闭弹窗
        closeAddCustomerContacts() {
            this.addCustomerContactsVisible = false
        },
        //添加点击后回调函数
        addCustomerContacts(customerContacts) {
            var _this = this
            var cusCon = customerContacts
            cusCon.contactsId = null
            console.log(cusCon)
            var list = [];
            list.push(cusCon);
            var addCon = {
                customerId: this.editCustomerForm.customerId,
                contactsList: list
            };
            this.$axios.post(
                '/customer/customer/addContacts',
                addCon
            ).then(res => {
                var customer = this.editCustomerForm;
                customer.customerCity = JSON.stringify(this.editCustomerForm.customerCity)
                customer.customerStatus = 10
                customer.customerMgrName = 1
                customer.customerMgrDept = 1
                _this.loadCustomerContacts(customer)
            });
            this.$message.success("Add success！")
            console.log(customerContacts)
        },
        //打开弹窗
        closeEditCustomerContacts() {
            this.editCustomerContactsVisible = false
        },
        //关闭弹窗
        openEditCustomerContacts() {
            this.editCustomerContactsVisible = true
        },
        //添加点击后回调函数
        editCustomerContacts(customerContacts) {
            console.log('update customer', customerContacts)
            console.log(QS.stringify(customerContacts))
            this.updateCustomerContacts(customerContacts)
            console.log(customerContacts)
        },
        handleEditCustomerContacts(index, row) {
            const data = JSON.parse(JSON.stringify(row))
            this.$refs.CustomerContactsDialog.setData(data)
            this.openEditCustomerContacts();
            console.log(index, row);
        },
        handleDeleteCustomerContacts(index, row) {
            this.$confirm('Are you sure you want to delete this customer contact?', 'Tips', {
                confirmButtonText: 'Confirm',
                cancelButtonText: 'Cancel',
                type: 'warning'
            }).then(() => {
                console.log(index, row);
                this.$axios.post(
                    '/customer/customer/deleteContactsById',
                    row
                )
                this.customerContactsTable.splice(index, 1)
                this.$message({
                    type: 'success',
                    message: 'Delete success!'
                });
            })
        },


        //customerRelationship
        //打开弹窗
        updateCustomerRelationship(customerRelationship) {
            var _this = this
            this.$axios.post(
                '/customer/customer/updateCustomerRelationship',
                customerRelationship
            ).then(res => {
                var customer = this.editCustomerForm;
                customer.customerCity = JSON.stringify(this.editCustomerForm.customerCity)
                customer.customerStatus = 10
                customer.customerMgrName = 1
                customer.customerMgrDept = 1
                _this.loadCustomerRelationship(customer)
                console.log(res)
            });
        },
        openAddCustomerRelationship() {
            this.$refs.AddCustomerRelationshipDialog.init();
            this.addCustomerRelationshipVisible = true;
        },
        //关闭弹窗
        closeAddCustomerRelationship() {
            this.addCustomerRelationshipVisible = false
        },
        //弹窗点击添加后回调函数
        addCustomerRelationship(customerRelationship) {
            var _this = this
            var cusRel = customerRelationship;
            cusRel.id = null
            cusRel.relativeCustomerId1 = this.editCustomerForm.customerId
            var list = []
            list.push(cusRel)
            this.$axios.post(
                '/customer/customer/addCustomerRelationship',
                list
            ).then(res => {
                var customer = this.editCustomerForm;
                customer.customerCity = JSON.stringify(this.editCustomerForm.customerCity)
                customer.customerStatus = 10
                customer.customerMgrName = 1
                customer.customerMgrDept = 1
                _this.loadCustomerRelationship(customer)
            });
            this.$message.success("Add success！")
            console.log(customerRelationship)
        },
        //打开弹窗
        openEditCustomerRelationship() {
            this.$refs.CustomerRelationshipDialog.init();
            this.editCustomerRelationshipVisible = true;
        },
        //关闭弹窗
        closeEditCustomerRelationship() {
            this.editCustomerRelationshipVisible = false
        },
        //添加点击后回调函数
        editCustomerRelationship(customerRelationship) {
            console.log('update customerRelationship', customerRelationship)
            var cusRel = customerRelationship
            cusRel.relativeCustomerId1 = this.editCustomerForm.customerId
            console.log(QS.stringify(cusRel))
            this.updateCustomerRelationship(cusRel)
            console.log(cusRel)
        },
        handleEditCustomerRelationship(index, row) {
            const data = JSON.parse(JSON.stringify(row))
            this.$refs.CustomerRelationshipDialog.setData(data)
            this.openEditCustomerRelationship()
            console.log(index, row);
        },
        handleDeleteCustomerRelationship(index, row) {
            this.$confirm('Are you sure you want to delete this customer relationship?', 'Tips', {
                confirmButtonText: 'Confirm',
                cancelButtonText: 'Cancel',
                type: 'warning'
            }).then(() => {
                console.log(index, row)
                var cusRel = row;
                cusRel.relativeCustomerId1 = this.editCustomerForm.customerId
                cusRel.customerRelationId = 10
                this.$axios.post(
                    '/customer/customer/deleteCustomerRelationshipById',
                    cusRel
                )
                this.customerRelationshipTable.splice(index, 1)
                this.$message({
                    type: 'success',
                    message: 'Delete success!'
                });
            })
        },

        handleFreezeCustomer() {
            const s = this.editCustomerForm.customerStatus
            var t = s === '20' ? 'UnFreeze' : 'Freeze'
            var _this = this
            this.$confirm('Confirm to ' + t + ' customer?', {
                cancelButtonText: 'cancel',
                confirmButtonText: 'confirm'
            }).then(e => {
                var customer = JSON.parse(JSON.stringify(_this.editCustomerForm))
                customer.customerCity = JSON.stringify(customer.customerCity)
                console.log(s)
                customer.customerStatus = s === '20' ? '10' : '20'
                console.log(customer)
                _this.$axios.post(
                    '/customer/customer/updateCustomer',
                    customer
                ).then(res => {
                    console.log("freeze", res)
                    _this.$message.success("Freeze success!")
                    _this.editCustomerForm.customerStatus = s === '20' ? '10' : '20'
                    _this.disable1 = _this.editCustomerForm.customerStatus === '20'
                })
            })


        },

        handleClose(done) {
            if (this.currentUser.roles[0] !== this.$npms.roles.MARKET_SP) {
                this.$confirm('Closing now will lose all unsaved data. Confirm closing?', {
                    cancelButtonText: 'cancel',
                    confirmButtonText: 'confirm'
                })
                    .then(e => {
                        done();
                    })
            } else {
                done();
            }

        },
        setDataa(data) {
            this.editCustomerForm = data
            // this.editCustomerForm.customerCity = JSON.parse(data.customerCity)//TODO JSON parse省市信息
        }
    },
    mounted() {
        var user = this.$store.getters.getUser;
        this.currentUser = user;
        console.log(user)
        var role = user.roles[0]
        if (role === this.$npms.roles.MARKET_SP) {
            this.disable1 = true
        }

    },
    watch:
        {
            editCustomerForm: {
                handler(val, oldVal) {
                    if (val.customerStatus === '20')
                        this.disable1 = true
                },
                deep: true
            }
        }
}
</script>

<style scoped>
.fullscreen {
    position: absolute;
    right: 50px;
    top: 18px;
    cursor: pointer;
    transition: all 200ms;
}

.fullscreen:hover {
    color: #6DBEF8;
}
</style>